<template>
	<view class="order-container" :class="{ 'safe-area': isIphoneX }" :data-theme="themeStyle">
		<!-- 选择地址 -->
		<view class="address-box">
			<view class="info-wrap" v-if="Object.keys(address).length > 0" @click="selectAddress">
				<view class="icon-wrap"><text class="iconfont icondizhi"></text></view>
				<view class="content">
					<text class="name font-size-base">{{ address.name ? address.name : '' }}</text>
					<text class="font-size-base">{{ address.mobile ? address.mobile : '' }}</text>
					<text class="cell-more iconfont iconright"></text>
					<view class="desc-wrap">
						{{ address.full_address ? address.full_address : '' }}
						{{ address.address ? address.address : '' }}
					</view>
				</view>
			</view>
			<view class="empty-wrap" v-else @click="selectAddress">
				<view class="icon-wrap"><view class="iconfont icondizhi empty"></view></view>
				<view class="info">请设置收货地址</view>
				<view class="cell-more"><view class="iconfont iconright"></view></view>
			</view>
		</view>

		<!-- 店铺 -->
		<view class="site-wrap">
			<view class="site-body">
				<view class="goods-wrap" @click="toDetail(goodsData)">
					<view class="goods-img">
						<image :src="$util.img(goodsData.award_img)" ></image>
					</view>
					<view class="goods-info">
						<view class="goods-name">{{goodsData.relate_name}}</view>
						<view class="goods-sub-section">
							<text class="goods-price">{{goodsData.original_price}}元</text>
							<view>
								<text class="font-size-tag">x1</text>
							</view>
						</view>
					</view>
				</view>
				
				<view class="order-cell" v-if="goodsData.award_type == 5" style="color: #FF0036;">礼品领取成功后,到个人中心【我的礼品】查看详情</view>	
				<view class="order-cell" v-if="goodsData.award_type == 6 && goodsData.is_use==1" style="color: #FF0036;">购买后可获得最低{{goodsData.min_red}}元红包奖励，更有机会到手0元</view>				
			</view>
			<view class="site-footer">
				<view class="order-cell">
					<text class="tit">领取留言</text>
					<view class="box"><input type="text" placeholder="领取特殊说明" placeholder-class="color-tip" v-model="buyer_message" /></view>
				</view>
			</view>
		</view>

		<view class="order-submit" :class="{ 'bottom-safe-area': isIphoneX }">
			<view class="order-settlement-info">
				<text class="font-size-base color-tip margin-right">共1件</text>
				<text class="font-size-base">需支付：</text>
				<text class="color-base-text money">{{ goodsData.pay_price }}</text>
				<text class="color-base-text unit">元</text>
			</view>
			<view class="submit-btn"><button type="primary" size="mini" @click="openChoosePayment()">{{goodsData.award_type == 6 ? '立即购买' : '立即领取'}}</button></view>
		</view>

		<!-- 选择支付方式弹窗 -->
		<ns-payment ref="choosePaymentPopup"
			:isBalance="goodsData.is_balance"
			@useBalance="useBalance"
			:balanceDeduct="goodsData.purchase_price > 0 && goodsData.balance_total > 0 ? balanceDeduct : '0'"
			:payMoney="goodsData.pay_price" 
			@confirm="orderCreate"></ns-payment>
	
		<loading-cover ref="loadingCover"></loading-cover>
	</view>
</template>

<script>
import payment from '../public/js/payment.js';
import uniPopup from '@/components/uni-popup/uni-popup.vue';
import globalConfig from '@/common/js/golbalConfig.js';
import nsPayment from '@/components/payment/payment.vue';

export default {
	components: {
		uniPopup,
		nsPayment
	},
	mixins: [payment, globalConfig],
	onShow() {
		uni.setNavigationBarTitle({
			title: '奖品详情'
		})
	},
	methods: {
		toDetail(goodsData) {
			if (goodsData.award_type == 6) {
				this.$util.redirectTo('/pages/goods/detail/detail?preview=1&sku_id='+goodsData.relate_id);
			}
		}
	}
};
</script>

<style lang="scss">
@import './../../../common/css/order_parment.scss';
</style>
<style scoped>
/deep/ .uni-popup__wrapper.uni-custom .uni-popup__wrapper-box {
	background: none;
	max-height: unset !important;
	overflow-y: hidden !important;
}
>>> .uni-popup__wrapper {
	border-radius: 20rpx 20rpx 0 0;
}
>>> .uni-popup {
	z-index: 8;
}
</style>
